(function() {
	window.DatePicker = function(classname) {
		//		var link=document.createElement("link");
		//		link.rel = "stylesheet";
		// 		link.type = "text/css";
		// 		link.href = "datepicker/fonts/style.css";
		// 		document.getElementsByTagName("head")[0].appendChild(link);
		return new init(classname);
	}
	var StringBuffer = function() {
		this._string_ = [];
	}
	var addEvent = function(o, e, f) {
		if (window.attachEvent) {
			o.addEvent('on' + e, f);
		} else {
			o.addEventListener(e, f, false);
		}
	}
	var init = function(classname) {
		window.datepicker = this;
		this.els = document.getElementsByClassName(classname);
		for (var i = 0; i < this.els.length; i++) {
			this.els[i].dpid = "datepicker-" + (i + 1);
		}
		Date.prototype._week = function() {
			var d = new Date(this);
			d.setDate(1);
			return d.getDay();
		}
		Date.prototype._days = function() {
			var d1 = new Date(this),
				d2 = new Date(this);
			d1.setDate(1);
			d2.setDate(1);
			d2.setMonth(d2.getMonth() + 1);
			return (d2 - d1) / 86400000;
		}
		Date.prototype.pre_days = function() {
			var d1 = new Date(this),
				d2 = new Date(this);
			d1.setDate(1);
			d2.setDate(1);
			d2.setMonth(d2.getMonth() - 1);
			return (d1 - d2) / 86400000;
		}
		this.bind();
	}
	init.prototype = {
		update_box: function(y, m) {
			var D = this.D;
			if (y != null) D.setFullYear(D.getFullYear() + y);
			if (m != null) D.setMonth(D.getMonth() + m);
			var year = D.getFullYear(), //获取年
				month = D.getMonth(), //获取月
				date = D.getDate(); //获取日
			var con = [],
				week = ['日', '一', '二', '三', '四', '五', '六'];
			var yue = ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'];
			var _html;
			var fn = function(a, b) {
				return "datepicker.update_box(" + a + "," + b + ")";
			}
			_html = "<div dpid='datepicker'><span dpid='datepicker' class='icon' onclick='" + fn(-1, null) + "'>&#xe901</span><span dpid='datepicker' class='icon' onclick='" + fn(null, -1) + "'>&#xe903</span>";
			_html += "<span dpid='datepicker' style='margin-left:20px;cursor:default;'>" + year + "年</span><span dpid='datepicker' style='display:inline-block;margin-left:20px;margin-right:20px;cursor:default;width:42px;'>" + yue[month] + "</span>";
			_html += "<span dpid='datepicker' class='icon' onclick='" + fn(null, 1) + "'>&#xe900</span><span dpid='datepicker' class='icon' onclick='" + fn(1, null) + "'>&#xe902</span>";
			_html += "</div>";
			_html += "<table cellpadding='2' cellspacing='0' style='width:100%;margin-top:10px;'><tr>";
			for (var i = 0; i < week.length; i++) {
				_html += "<th dpid='datepicker' style='background:#38f;color:#fff;cursor:default;'>" + week[i] + "</th>";
			}
			_html += "</tr><tr>";
			var con = [];
			for (var i = 0; i < D._week(); i++) {
				con.push("<td dpid='datepicker' style='color:#c3c3c3;cursor:default;'>" + (D.pre_days() - D._week() + i + 1) + "</td>");
			}
			for (var i = 0; i < D._days(); i++) {
				var str = "";
				if (con.length % 7 == 0) str = "</tr>";
				if ((i + 1) == date)
					str += "<td class='date' onclick='datepicker.fillinput(" + year + "," + month + "," + (i + 1) + ")' style='cursor:pointer;background:#38f;color:#fff;'>" + (i + 1) + "</td>";
				else
					str += "<td class='date' onclick='datepicker.fillinput(" + year + "," + month + "," + (i + 1) + ")' style='cursor:pointer;'>" + (i + 1) + "</td>";
				con.push(str);
			}
			var size = con.length;
			for (var i = 0; i < 42 - size; i++) {
				if (con.length % 7 == 0) con.push("</tr><td dpid='datepicker' style='color:#c3c3c3;cursor:default;'>" + (i + 1) + "</td>");
				else con.push("<td dpid='datepicker' style='color:#c3c3c3;cursor:default;'>" + (i + 1) + "</td>");
			}
			_html += con.join("") + "</tr></table>";
			this.box.innerHTML = _html;
		},
		createbox: function(el) {
			this.D = new Date();
			if (this.box != null) this.removebox();
			var box = document.createElement("div");
			var pos = this.getPos(el);
			box.style.cssText = "position:absolute;";
			box.dpid = "datepicker";
			box.className = "date-picker-box";
			var s = box.style;
			s['left'] = pos.x + "px";
			s['top'] = pos.y + el.offsetHeight + "px";
			document.body.appendChild(box);
			this.box = box;
			this.update_box();
		},
		fillinput: function(y, m, d) {
			var s = "/";
			this.els[this.curri].value = y + s + (m + 1) + s + d;
		},
		removebox: function() {
			if (this.box != null) {
				document.body.removeChild(this.box);
				this.box = null;
			}
		},
		bind: function() {
			_this = this;
			addEvent(window, 'click', function(e) {
				var t = e.target || e.srcElement;
				if (t.dpid != null || t.attributes.dpid != null) {
					if (t.dpid == null) return;
					var s = t.dpid.split("-");
					var i = s[1] - 1;
					if (i >= 0) {
						_this.curri = i;
						_this.createbox(_this.els[i]);
					}
				} else {
					_this.removebox();
				}
			});
		},
		getPos: function(e) {
			for (var pos = {
					x: 0,
					y: 0
				}; e; e = e.offsetParent) {
				pos.x += e.offsetLeft;
				pos.y += e.offsetTop;
			}
			return pos;
		}
	}
})();

onload = function() {
	DatePicker("date-picker");
}